<template>
  <template v-for="(item, index) in prop.TableHeaderButton" :key="index">
    <span class="TableAction">
      <a-button v-if="item === 'add'" type="primary" @click="open('新增','add')">
        新增
      </a-button>
      <a-button v-if="item === 'edit'" danger @click="open('编辑','edit')">
       编辑
      </a-button>
      <a-button v-if="item === 'delete'">
       删除
      </a-button>
      <a-button v-if="item === 'export'" @click="exportBtn">
       导出
      </a-button>
    </span>
  </template>
</template>

<script setup>
const emit = defineEmits(['changeStatus']);
const prop = defineProps({
  TableHeaderButton: {
    type: Array,
    default: [],
  },
  openModel: {
    type: Function,
    default: () => {
    }
  },
  exportFunction: {
    type: Function,
    default: () => {
    }
  }
});


const open = (title, type) => {
  emit('changeStatus', type);
  prop.openModel(title)
}

const exportBtn = () => {
  prop.exportFunction();
}
</script>

<style lang="scss" scoped>
.TableAction {
  margin-right: 10px;
}
</style>